<template>
    <div style="height:1000">
        <el-form ref="form" :model="form" label-width="80px">
            <div style="display：inline-block">
                <el-form-item label="姓名">
                    <el-input v-model="form.name"></el-input>
                </el-form-item>
                <el-form-item label="性别">
                    <el-input v-model="form.sex"></el-input>
                </el-form-item>
                <el-form-item label="年龄">
                    <el-input v-model="form.age"></el-input>
                </el-form-item>
                <el-form-item label="电子邮件">
                    <el-input v-model="form.mail"></el-input>
                </el-form-item>
                <el-form-item label="联系电话">
                    <el-input v-model="form.tel"></el-input>
                </el-form-item>
            </div>
            <div style="display：inline-block">
                <el-form-item label="联系地址">
                    <el-input v-model="form.area"></el-input>
                </el-form-item>
                <el-form-item label="政治面貌">
                    <el-input v-model="form.policy"></el-input>
                </el-form-item>
                <el-form-item label="学历">
                    <el-input v-model="form.degree"></el-input>
                </el-form-item>
                <el-form-item label="毕业院校">
                    <el-input v-model="form.school"></el-input>
                </el-form-item>
                <el-form-item label="专业">
                    <el-input v-model="form.major"></el-input>
                </el-form-item>


            </div>
            <div style="margin-top: 20px">
                <label style="text-align: right;float: left;color: #606266;padding: 0 12px 0 12px;font-size: 14px">个人简介</label>
                <el-input
                        type="textarea"
                        v-model="form.intro"
                        style="width:40%"
                ></el-input>
            </div>

            <el-form-item label="个人特长" style="margin-top: 20px">
                <el-table :data="talents" style="width: 100%">
                    <el-table-column prop="id" label="序号" width="300"></el-table-column>
                    <el-table-column prop="name" label="特长项目" width="300"></el-table-column>
                    <el-table-column prop="level" label="特长水平" width="300"></el-table-column>
                    <el-table-column label="修改" width="250">
                        <template slot-scope="scope">
                            <el-button type="primary" size="mini" @click="mid(scope.$index)">修改</el-button>
                            <el-dialog
                                    title="提示"
                                    :visible.sync="dialogVisible1"
                                    width="30%"


                            >
            <span>

                <div style="display:inline">
                <label>特长项目</label>
                <el-input
                        v-model="talent_amend.name"
                        style="margin-right: 40%,padding-bottom: 10px"
                ></el-input>
                
             
                <label>特长水平</label>
                <el-input
                        v-model="talent_amend.level"
                        style="margin-right: 40% margin-top: 10px"
                ></el-input>
               
                              
                </div>
             
            </span>
                                <span slot="footer" class="dialog-footer">
              <el-button @click="mid1()">取 消</el-button>
              <el-button type="primary" @click="amend1()"
              >确 定</el-button
              >
            </span>
                            </el-dialog>


                        </template>
                    </el-table-column>
                    <el-table-column label="删除" width="250">

                        <template slot-scope="scope">
                            <el-button type="danger" size="mini" @click="del1(scope.$index)">删除</el-button>

                        </template>

                    </el-table-column>
                </el-table>
            </el-form-item>

            <el-button type="primary" size="mini" @click="dialogVisible2 = true"
                       style="margin-left: 35%;margin-top: 20px">
                添加
            </el-button>
            <el-dialog
                    title="提示"
                    :visible.sync="dialogVisible2"
                    width="30%"


            >
            <span>

                <div style="display:inline">
                <label>特长项目</label>
                <el-input
                        v-model="talent_amend.name"
                        style="margin-right: 40%,padding-bottom: 10px"
                ></el-input>
                
             
                <label>特长水平</label>
                <el-input
                        v-model="talent_amend.level"
                        style="margin-right: 40% margin-top: 10px"
                ></el-input>
               
                              
                </div>
             
            </span>
                <span slot="footer" class="dialog-footer">
              <el-button @click="mid2()">取 消</el-button>
              <el-button type="primary" @click="add()"
              >确 定</el-button
              >
            </span>
            </el-dialog>

            <el-form-item label="历史评价" style="margin-top: 20px">
                <el-table :data="evaluate" style="width: 100%">
                    <el-table-column prop="role" label="评价对象" width="300"></el-table-column>
                    <el-table-column prop="content" label="评价内容" width="300"></el-table-column>
                    <el-table-column prop="grade" label="评价分数" width="300"></el-table-column>

                </el-table>

            </el-form-item>

        </el-form>


        <el-button
                type="primary"
                @click="submit()"
                style="margin-left: 40%;margin-top: 20px"
        >提交
        </el-button
        >
    </div>
</template>

<script>
    export default {
        name: "EmpFile",
        data() {
            return {
                index: "",
                amend: {
                    id: "",
                    name: "",
                    level: "",
                },
                a: {
                    name: "",
                    level: "",
                },
                talents: [],
                evaluate: [],
                talent_amend: {
                    id: "",
                    name: "",
                    level: "",
                },
                form: {

                    name: "",
                    sex: "",
                    mail: "",
                    intro: "",
                    pub: "",
                    tel: "",
                    policy: "",
                    area: "",
                    degree: "",
                    school: "",
                    major: "",
                    age: "",
                    // talents:[],
                    // positions:[],
                    // deeds:[],
                    // evaluates:[],
                },
                // form_new: {
                //   id:"",
                //   name: "",
                //   sex: "",
                //   mail: "",
                //   intro: "",
                //   date:"",
                //   pub:"",
                //   tel:"",
                //   policy: "",
                //   area: "",
                //   degree: "",
                //   school: "",
                //   major: "",
                //   age: "",
                //   talents:[],
                //   positions:[],
                //   deeds:[],
                //   evaluates:[],
                // },
                dialogVisible: false,
                dialogVisible1: false,
                dialogVisible2: false,
            };
        },
        created() {

            this.getRequest('/emp/file/get').then((res) => {
                let hr = res.data;
                // console.log(hr.archive.name);
                this.form.name = hr.archive.name;
                this.form.pub = hr.archive.pub;
                this.form.sex = hr.archive.sex;
                this.form.mail = hr.archive.mail;
                this.form.intro = hr.archive.intro;
                this.form.tel = hr.archive.tel;
                this.form.policy = hr.archive.policy;
                this.form.area = hr.archive.area;
                this.form.degree = hr.archive.degree;
                this.form.school = hr.archive.school;
                this.form.major = hr.archive.major;
                this.form.age = hr.archive.age;


                hr.archive.talents.forEach((item) => {
                    this.talents.push({
                        id: item.id,
                        name: item.name,
                        level: item.level,

                    });
                });

                hr.archive.evaluates.forEach((item) => {
                    this.evaluate.push({
                        role: item.role,
                        content: item.content,
                        grade: item.grade,

                    });
                });
            })


        },
        methods: {
            onSubmit() {

            },
            submit() {
                let hr = JSON.parse(window.sessionStorage.getItem("user")).user;
                // this.form.id=hr.archive.id;
                // this.form.date=hr.archive.date;
                this.form.pub = hr.archive.pub;
                // this.form.talents=this.talents;
                // this.form.positions=hr.archive.positions;
                // this.form.deeds=hr.archive.deeds;
                // this.form.evaluates=this.evaluate;
                // this.$http.put("localhost:8081/emp/file/put",this.form).
                //   this.axios({
                //   method: "put",
                //   url: "http://localhost:8081/emp/file/put",
                //   data: this.form,
                // }).
                // then((response) =>{
                this.putRequest('/emp/file/put', this.form).then((response) => {


                }).catch((error) => {
                    this.$message.error("上传失败");
                    //alert("无法展示");

                });


            },
            add() {
                this.talents.push({
                    name: this.talent_amend.name,
                    level: this.talent_amend.level,

                });
                this.a.name = this.talent_amend.name,
                    this.a.level = this.talent_amend.level,
                    this.postRequest('/emp/talent/post', this.a).then((res) => {
                        this.a.id = res.data.tid;
                        this.talents.push({
                            id: this.a.id,
                            name: this.a.name,

                            level: this.a.level,

                        });

                    }).catch((error) => {
                        this.$message.error("上传失败");
                        //alert("无法展示");

                    });
                this.talent_amend.id = "";
                this.talent_amend.name = "";
                this.talent_amend.level = "";
                this.dialogVisible2 = false;
            },
            amend() {
                this.dialogVisible = false;

            },
            mid(index) {
                this.index = index;
                this.dialogVisible1 = true;
            },
            mid1() {
                this.dialogVisible1 = false;
                this.talent_amend.id = "";
                this.talent_amend.name = "";
                this.talent_amend.level = "";
            },
            mid2() {
                this.dialogVisible2 = false;
                this.talent_amend.id = "";
                this.talent_amend.name = "";
                this.talent_amend.level = "";
            },
            amend1() {

                this.talents[this.index].name = this.talent_amend.name;
                this.talents[this.index].level = this.talent_amend.level;
                this.talent_amend.id = this.talents[this.index].id;
                this.amend.id = this.talent_amend.id;
                this.amend.name = this.talent_amend.name;
                this.amend.level = this.talent_amend.level;


                this.putRequest('/emp/talent/put', this.amend).then((response) => {


                }).catch((error) => {
                    this.$message.error("上传失败");
                    //alert("无法展示");

                });
                this.talent_amend.id = "";
                this.talent_amend.name = "";
                this.talent_amend.level = "";

                this.dialogVisible1 = false;

            },
            del1(dex) {
                let tid = this.talents[dex].id;
                this.$delete(this.talents, dex);


                this.deleteRequest('/emp/talent/delete', {'tid': tid}).then((response) => {


                }).catch((error) => {
                    this.$message.error("上传失败");
                    //alert("无法展示");

                });


            },
            handleClose(done) {
                this.$confirm("确认关闭？")
                    .then((_) => {
                        done();
                    })
                    .catch((_) => {
                    });
            },
        },
    };
</script>

<style scoped>
    .el-form-item {
        display: inline-block !important;
    }

    .el-form-item__label {
        display: none;
        width: 0px !important;
    }
</style>